import * as React from "react";
import { observer } from "mobx-react";
import { observable } from "mobx";
import { Table } from "antd"; //columnsDataCLass
import { columnsDataCLass } from "../../../../../../data/interface/publicInterface";
import "./index.less";

export interface ConditionTableProps {
  dataSouce: any[];
  columns: columnsDataCLass[];
}

export interface ConditionTableState {}
@observer
class ConditionTable extends React.Component<
  ConditionTableProps,
  ConditionTableState
> {
  @observable private columns: any[] = [
    {
      title: "Full Name",
      width: 100,
      dataIndex: "name",
      key: "name",
      fixed: "left",
    },
    {
      title: "Age",
      width: 100,
      dataIndex: "age",
      key: "age",
      fixed: "left",
    },
    {
      title: "Column 1",
      dataIndex: "address",
      key: "1",
      width: 150,
    },
    {
      title: "Column 2",
      dataIndex: "address",
      key: "2",
      width: 150,
    },
    {
      title: "Column 3",
      dataIndex: "address",
      key: "3",
      width: 150,
    },
    {
      title: "Column 4",
      dataIndex: "address",
      key: "4",
      width: 150,
    },
    {
      title: "Column 5",
      dataIndex: "address",
      key: "5",
      width: 150,
    },
    {
      title: "Column 6",
      dataIndex: "address",
      key: "6",
      width: 150,
    },
    {
      title: "Column 7",
      dataIndex: "address",
      key: "7",
      width: 150,
    },
    {
      title: "Column 8",
      dataIndex: "address",
      key: "8",
      width: 180,
    },
  ];
  // state = { :  }
  render() {
    return (
      <>
        <div className="rowcon_body" style={{ height: 436 }}>
          <Table
            // size="small"
            // style={{ height: 300 }}
            columns={this.props.columns}
            dataSource={this.props.dataSouce}
            pagination={false}
            // scroll={{ y: 300, x: 1500 }}
            sticky
          />
        </div>
      </>
    );
  }
}

export default ConditionTable;
